//初始化富文本编辑器
initEditor();
//剪裁框
// 1. 初始化图片裁剪器
// 2. 裁剪选项
let options = {
  aspectRatio: 400 / 280,
  preview: ".img-preview",
};
// 3. 初始化裁剪区域
$("#image").cropper(options);
$('button:contains("选择封面")').on("click", function () {
  $(".file").trigger("click");
});
//文件域内容改变,更改剪裁区图片
$(".file").on("change", function () {
  //获取文件对象
  let fileObj = this.files[0];
  //创建url
  let url = URL.createObjectURL(fileObj);
  //更换剪裁区图片
  $("#image").cropper("replace", url);
});
//获取分类,再次渲染
$.ajax({
  url: "/my/category/list",
  success: (res) => {
    let str;
    $.each(res.data, (index, item) => {
      str += `<option value=${item.id}>${item.name}</option>`;
    });
    $(".type").append(str);
    let form = layui.form;
    form.render();
  },
});
//点击监听事件
$("form").on("submit", function (e) {
  e.preventDefault();
  //上传文件而使用formdata
  let fd = new FormData(this);
  //content没有值
  fd.set("content", tinyMCE.activeEditor.getContent());
  //裁剪图片
  let pic = $("#image").cropper("getCroppedCanvas", {
    width: 400,
    height: 280,
  });
  pic.toBlob(function (blob) {
    //给formdata添加文件对象
    fd.append("cover_img", blob);
    //当添加完成后ajax提交请求
    $.ajax({
      type: "post",
      url: "/my/article/add",
      data: fd,
      //阻止自动转化为查询字符串
      processData: false,
      //取消请求头
      contentType: false,
      success: (res) => {
        if (res.status === 0) {
          layer.msg(
            res.message,
            {
              time: 1000, //1秒关闭（如果不配置，默认是3秒）
            },
            function () {
              //完成提交,跳转页面
              location.href = "./list.html";
            }
          );
        } else {
          layer.msg(res.message);
        }
      },
    });
  });
});
